<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ apk.app_name }}详情</title>
    <link rel="stylesheet" href="{% static 'bootstrap5/bootstrap.min.css' %}">
    <script src="{% static 'bootstrap5/popper.min.js' %}"></script>
    <script src="{% static 'bootstrap5/bootstrap.min.js' %}"></script>
</head>
<body>
<header>
    <div class="px-3 py-2 text-bg-dark">
        <div class="container">
            <div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
                <a href="/" class="d-flex align-items-center my-2 my-lg-0 me-lg-auto text-white text-decoration-none">
                    <svg class="bi me-2" width="40" height="32" role="img" aria-label="Bootstrap"><use href="#bootstrap"></use></svg>
                </a>

                <ul class="nav col-12 col-lg-auto my-2 justify-content-center my-md-0 text-small">
                    <li>
                        <a href="/index" class="nav-link text-white">
                            <svg class="bi d-block mx-auto mb-1" width="24" height="24"><use  href="#speedometer2"></use></svg>
                            主页
                        </a>
                    </li>
                    <li>
                        <a href="#" class="nav-link text-secondary">
                            <svg class="bi d-block mx-auto mb-1" width="24" height="24"><use  href="#home"></use></svg>
                            检测记录
                        </a>
                    </li>
                    <li>
                        <a href="#" class="nav-link text-white">
                            <svg class="bi d-block mx-auto mb-1" width="24" height="24"><use  href="#table"></use></svg>
                            智能助手
                        </a>
                    </li>
                    <li>
                        <a href="#" class="nav-link text-white">
                            <svg class="bi d-block mx-auto mb-1" width="24" height="24"><use  href="black"></use></svg>
                            黑/白名单
                        </a>
                    </li>
                    <li>
                        <a href="#" class="nav-link text-white">
                            <svg class="bi d-block mx-auto mb-1" width="24" height="24"><use  href="#people-circle"></use></svg>
                            模型信息
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="px-3 py-2 border-bottom mb-3">
        <div class="container d-flex flex-wrap justify-content-center">
            <form class="col-12 col-lg-auto mb-2 mb-lg-0 me-lg-auto" role="search">
                <input type="search" class="form-control" placeholder="Search..." aria-label="Search">
            </form>

            <div class="text-end">
                <button type="button" class="btn btn-light text-dark me-2">加入白名单</button>
                <button type="button" class="btn btn-primary">加入黑名单</button>
            </div>
        </div>
    </div>
</header>
<main class="container bg-white p-3 rounded">
    <h1>APK信息基本信息</h1>
    <hr>
    <div class="mt-2">
{#        <img src="{% static 'image/avatar.webp' %}" class="rounded-circle" width="30" height="30" alt="">#}
        <span class="ms-2"></span>
        <span class="ms-2">于</span>
        <span class="ms-2">{{apk.record_time|date:"Y年m月d日 h时i分"}} </span>检测
    </div>
    <div>
{#        <a href="/filter/106_0a855b5a86f082c4efa7f89640f7ba30.apk" download="{{ apk.app_name }}" target="_blank" >下载APK解压包</a>#}
        <a href="www.baidu.com" download="{{ apk.app_name }}" target="_blank" >下载APK解压包</a>
    </div>
    <hr>
    <div class="py-2">
        <hr>
        <h3>结果：{{ apk.ret }}</h3>（0为正常应用，1为涉诈应用）
        <hr>
        <p>名称：<br>{{ apk.app_name }}</p>
        <p>包名：<br>{{ apk.package }}</p>
        <p>版本号：<br>{{ apk.version_name}}</p>
        <p>数值版本号：<br>{{ apk.version_code }}</p>
        <p>安装包大小：<br>{{ apk.apk_size }} MB</p>
        <p>解压后文件夹大小：<br>{{ apk.folder_size }} MB</p>
        <p>icon路径：<br><code>{{ apk.icon_url}}</code></p>
        <p>字符串资源文件路径：<br> <code>/res/values/strings.xml </code></p>
        <p>开发者（通常是颁发者）:<br>{{ apk.issuer }}</p>
        <p>MD-5 签名:<br>{{ apk.md5 }}</p>
        <p>SHA-1 签名:<br>{{ apk.sha1 }}</p>
        <p>SHA-256 签名:<br>{{ apk.sha256 }}</p>
        <p>证书有效期:<br>{{ apk.validity_period}}</p>
        <p>签名算法:<br>{{ apk.signature_algo }}</p>
        <p>哈希算法:<br>{{ apk.hash_algo }}</p>
        <p>序列号:<br>{{ apk.serial_number }}</p>
        <p>书内容(DER 编码):<br>{{ apk.contents_der }}</p>
    </div>
    <hr>
    <div class="col">
        <div class="card shadow-sm">
            <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">
                可视化数据表达</text>
            </svg>
            <div class="card-body">
                <p class="card-text">单棵决策树路径</p>
                <img src="{% static 'image/tree_load.png' %}" alt="单棵决策树路径">
            </div>
            <hr>
            <div class="card-body">
                <p class="card-text">信息重要性</p>
                <img src="{% static 'image/ir.png' %}" alt="信息重要性">
            </div>
        </div>
    </div>
    <hr>
    <a href="http://localhost:8009/model/show_model"> 查看更多 </a>
    <hr>
    <div class="mt-2">
        <h1>APK配置信息</h1>
    </div>
    <div class="mt-2">
        <ul class="list-group list-group-flush">
            <li class="list-group-item mb-3">
                <div class="d-flex justify-content-between text-body-secondary">
                    <div class="user-info">
                        <span class="ms-2"><h3>权限</h3></span>
                    </div>
                    <div class="create-time" style="line-height: 40px;"></div>
                </div>
                <div class="mt-2">
                    {{ apk.permissions }}
                </div>
            </li>
            <li class="list-group-item mb-3">
                <div class="d-flex justify-content-between text-body-secondary">
                    <div class="user-info">
                        <span class="ms-2"><h3>意图</h3></span>
                    </div>
                    <div class="create-time" style="line-height: 40px;"></div>
                </div>
                <div class="mt-2">
                    {{ apk.intent }}
                </div>
            </li>
            <li class="list-group-item mb-3">
                <div class="d-flex justify-content-between text-body-secondary">
                    <div class="user-info">
                        <span class="ms-2"><h3>活动</h3></span>
                    </div>
                    <div class="create-time" style="line-height: 40px;"></div>
                </div>
                <div class="mt-2">
                    {{ apk.activities }}
                </div>
            </li>
        </ul>
    </div>
    <hr>
    <div class="mt-2">
        <h3>提问（{{ apk.chat_notes.all|length }}）</h3>
        <form action="{% url 'pub_notes' %}" method="POST">
            {% csrf_token %}
            <input type="hidden" name="apk_id" value="{{ apk.id }}">
            <div class="mt-2">
                <input type="text" class="form-control" placeholder="请输入问题" name="question">
            </div>
            <div class="text-end mt-2">
                <button type="submit" class="btn btn-primary">提问</button>
            </div>
        </form>
    </div>
    <div class="mt-2">
        <ul class="list-group list-group-flush">
            {% for note in apk.chat_notes.all %}
                <li class="list-group-item">
                    <div class="d-flex justify-content-between text-body-secondary">
                        <div class="create-time" style="line-height: 40px;">{{ note.pub_time|date:"Y年m月d日 h时i分" }}</div>
                    </div>
                    <div class="mt-2">
                        <h5>问题：</h5><p>{{ note.question }}</p>
                        <h5>回答：</h5><p>{{ note.answer }}</p>
                    </div>
                </li>
            {% endfor %}
        </ul>
    </div>
</main>
</body>
</html>